<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <title>html_test</title>
</head>
<body>
<header>
    <h2>Hello World!</h2>
</header>
<aside></aside>
<section>
    <p>==== 视频音频标签 ====</p>
    <video src="./video/1641458562227.mp4" controls="controls" width="500"></video>
    <!-- <audio -->
    <p>==== 列表标签 ====</p>
    <ul type="circle">
        <li>Tea</li>
        <li>Milk</li>
        <li>Coffee</li>
    </ul>
    <ol start="5">
        <li>Tea</li>
        <li>Milk</li>
        <li>Coffee</li>
    </ol>
    <dl>
        <dt>Tea</dt>
        <dd>绿茶</dd>
        <dd>红茶</dd>
        <dd>普洱</dd>
        <dt>Milk</dt>
        <dd>特仑苏</dd>
        <dd>经典</dd>
        <dt>Coffee</dt>
        <dd>瑞幸</dd>
        <dd>星巴克</dd>
    </dl>
    <p>==== 表格标签 ====</p>
    <table>
        <thead>
        <tr>
            <th>第一列</th>
            <th>第二列</th>
            <th>第三列</th>
        </tr>
        </thead>
        <tbody>
        <tr>
            <td>1</td>
            <td>bj</td>
            <td>sh</td>
        </tr>
        <tr>
            <td>2</td>
            <td>ycf</td>
            <td>cd</td>
        </tr>
        <tr>
            <td>3</td>
            <td>aabb</td>
            <td>aabb</td>
        </tr>
        </tbody>
    </table>
    <p>==== 表单标签 ====</p>
    <form action="#" method="post">
        <p>隐藏变迁：<input type="hidden" value="1" id="userId"/></p>
        <p>
            <label for="userName">单行文本：</label><input type="text" name="userName" list="myDataList"/>
            <datalist id="myDataList">
                <option value="first"> first</option>
                <option value="second"> second</option>
                <option value="third"> third</option>
            </datalist>
        </p>
        <p>密码框：<input type="password" name="password"/></p>
        <p>
        <div>单选框：<input type="radio" name="gendel" value="male"/>man</div>
        <div><input type="radio" name="gender" value="famale"/>woman</div>
        </p>
        <p>
            复选框： <input type="checkbox" name="hobby" value="book" checked/>读书
            <input type="checkbox" name="hobby" value="sports"/>运动
            <input type="checkbox" name="hobby" value="travel"/>旅行
            <input type="checkbox" name="hobby" value="game"/>游戏
        </p>
        <p>
            下拉框：<select>
            <option value="chengdu">成都</option>
            <option value="chongqing">重庆</option>
            <option value="beijing">北京</option>
        </select>
        </p>
        <p>多行文本框：<textarea rows="4" cols="20" disabled></textarea></p>
        <p>文件选择框：<input type="file"/></p>
        <p>一般按钮：<input type="button" value="一般按钮1"/> 一般按钮：
            <button>一般按钮2</button>
        </p>

        <p>
            重置按钮：<input type="reset" value="重置按钮"/> 重置按钮：
            <button type="reset">重置按钮</button>
        </p>
        <p>
            提交按钮：<input type="submit" value="提交按钮"/> 提交按钮：
            <button type="submit">提交按钮</button>
        </p>
        <p>日期选择框：<input type="date"/></p>
        <p>数字输入框：<input type="number" min="1" max="100" step="5"/></p>
        <p>邮件输入框：<input type="email"/></p>
    </form>
    <p>==== 图像标签 ====</p>
    <img src="./image/img-2yto08khtpw9w831yzuzmdhwh.jpg" width="200" height="200"/>
    <img
            src="https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fimg2.niutuku.com%2Fdesk%2F1207%2F0944%2Fntk111703.jpg&refer=http%3A%2F%2Fimg2.niutuku.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1644026015&t=ea8bacd14c595da5859bfebea59eb53f"
            width="300"
            height="200"
    />
    <p>==== 超链接标签 ====</p>
    <a href="http:www.baidu.com" target="_blank">百度</a>
    <p>==== 标题标签 ====</p>
    <h1>标题1</h1>
    <h2>标题2</h2>
    <h3>标题3</h3>
    <h4>标题4</h4>
    <h5>标题5</h5>
    <h6>标题6</h6>
    <p>==== 区块标签 ====</p>
    <div>这是一个 div 区块标签</div>
    <span>这是一个 span 区块标签</span>
</section>
<footer></footer>
</body>
</html>